
import React from 'react'
import { Layout,Button} from 'antd';
import logo from '../../assets/images/logo.jpg'
import PrivateLink from '../../component/PrivateLink/PrivateLink'
import OrderInfo from "../OrderInfo/OrderInfo";
import {Route} from 'react-router-dom'
//import TopNav from '../../component/TopNav/TopNav'
import '../../style/main.css'
import {observer,inject} from "mobx-react";
const { Header, Content} = Layout;
@inject('userStore')
@observer
class Main extends React.Component {
    outLogin=()=>{
        //console.log(this.props)
        this.props.userStore.loginOut().then(()=>{
            this.props.history.push('/Login')
        })
    }
    render() {
        return (
            <Layout >
                <Header className="header">
                    <div className="logo">
                        <img src={logo} alt="" style={{width:'80px',height:'58px'}}/>
                    </div>
                    <div style={{color:'white',fontSize:'22px'}}>六组react重构二阶段项目</div>
                    <div>
                        <Button type='primary' onClick={this.outLogin}>退出登录</Button>
                    </div>
                </Header>
                <Layout style={{height:document.body.clientHeight-64}}>
                    <PrivateLink/>
                    <Layout style={{ padding: '20px' }}>
                        {/*<TopNav/>*/}
                        <Content
                            className="site-layout-background"
                            style={{
                                padding: 10,
                                margin: 0,
                                minHeight: 500,
                            }}
                        >
                            {this.props.children}
                            <Route path="/Main/Orders/List/Info" component={OrderInfo} />
                        </Content>
                    </Layout>
                </Layout>
            </Layout>
        )
    }

    componentDidMount() {
    }
}

export default Main